<template>
  <div class="wuliu">
    <top></top>
    <div v-loading='loading' style="padding: 20px;">

      <div class="kflexbc">
        <div style="margin-bottom: 20px;">
          <el-button type="danger" round class="t_dr_btn"  @click="logkai()">添加销售链接</el-button>
          <el-button type="primary" round @click="goid('/gongju/shanghao')">前往号池管理>></el-button>
        </div>
        <div>
          <div><el-button type="primary" round plain @click="shuaxin()">刷新号码剩余</el-button></div>
          <!-- <div style="margin-top: 10px; font-size: 12px; color: #999;">上次刷新时间：{{shangcishijian}}</div> -->
        </div>
      </div>
      <div class="kflexc" style="margin-bottom: 20px;">
        <el-input v-model="all.name" style="width: 280px; margin-right: 20px;" placeholder="链接名称"></el-input>
        <el-input v-model="all.spuid" style="width: 280px; margin-right: 20px;" placeholder="商品 SPUID"></el-input>
        <el-input v-model="all.gth_sku" style="width: 280px; margin-right: 20px;" placeholder="商品编码前缀"></el-input>
        <el-button round @click="searchs" type="primary" plain style="margin-right: 20px;">搜索</el-button>
      </div>

      <el-table :data="list" border style="width: 100%; margin: 20px 0;" ref="multipleTable" >




        <el-table-column align='center' prop='outer_store_name' label="店铺"></el-table-column>
        <el-table-column align='center' prop='name' label="链接名称"></el-table-column>
        <el-table-column align='center' prop='spuid' label="商品 SPUID"></el-table-column>
        <el-table-column align='center' prop='gth_sku' label="商品编码前缀"></el-table-column>
        <!-- <el-table-column align='center' prop='pool_name' label="关联号池"></el-table-column> -->





        <el-table-column align='center' prop='type' label="上号方式">
          <template slot-scope="scope">
            <div v-if="scope.row.type == 0">手动</div>
            <div v-if="scope.row.type == 1">自动</div>
            <div v-if="scope.row.type == 2">广电号池</div>
            <!-- <i class="el-icon-edit" style="color: #409EFF;" @click="log4show(scope.row)"></i> -->
          </template>
        </el-table-column>

        <el-table-column align='center' prop='type' label="号池类型">
          <template slot-scope="scope">
            <div v-if="scope.row.mobile_type == 1">线上直取</div>
            <div v-if="scope.row.mobile_type == 0">本地号池</div>
            <div v-if="scope.row.mobile_type == 2">线上号池</div>
            <!-- 、 -->
          </template>
        </el-table-column>

        <el-table-column align='center' prop='pool_name' label="关联号池"></el-table-column>

        <el-table-column align='center' prop='number_min_amount' label="号码保持数量">
          <template slot-scope="scope">
            {{scope.row.number_min_amount}}
            <i class="el-icon-edit" style="color: #409EFF;" @click="log2show(scope.row)"></i>
          </template>
        </el-table-column>
        <el-table-column align='center' prop='not_sale_num' label="当前剩余号码数量">
          <!-- <template slot-scope="scope">
            {{list2[scope.$index].not_sale_num}}
          </template> -->
        </el-table-column>
        <el-table-column align='center' prop='gth_sku' label="商品编码前缀"></el-table-column>

        <el-table-column align='center' prop='updated_at' label="上次更新时间"></el-table-column>
        <el-table-column align='center' prop='number_min_amount' label="更新间隔">
          <template slot-scope="scope">
            {{scope.row.auto_min}}分钟
            <!-- <i class="el-icon-edit" style="color: #409EFF;" @click="log3show(scope.row)"></i> -->
          </template>
        </el-table-column>

        <el-table-column align='center' label="操作" width="350px">
          <template slot-scope="scope">
            <el-button type="text" style="margin-left: 0;" size="mini" @click="gengxinhaoma(scope.row)">更新号码</el-button>
            <el-button type="text" style="margin-left: 0;" size="mini" @click="logkai(scope.row)">编辑</el-button>
            <el-button type="text" style="margin-left: 0;" size="mini" @click="del(scope.row)">删除</el-button>
            <el-button type="text" style="margin-left: 0;" size="mini" @click="fuzhi(scope.row)">复制</el-button>
          </template>
        </el-table-column>
      </el-table>

      <el-pagination style="text-align: right;" background layout="total,prev, pager, next" :current-page="all.page" @current-change="fanye" :page-size="all.page_size" :total="total"></el-pagination>
    </div>
    <el-dialog title="添加销售链接" :visible.sync="log" width="740px"  :close-on-click-modal="false" :close-on-press-escape="false">
        <div style="position: absolute; right: 20px; top: 50px;" v-if="!this.all2.id">
          <el-button type="primary" round @click="yinyongkai">引用其他已有链接参数</el-button>
        </div>
        <div class="kflexc" style="margin-top: 20px;">
          <el-select v-model="all2.source" style="width: 400px;" @change="changedoudians" placeholder="请选择选择电商平台">
            <el-option label="抖音" value="douyin"></el-option>
            <el-option label="有赞" value="youzan"></el-option>
          </el-select>
        </div>

        <div class="kflexc" style="margin-top: 20px;"  v-if="all2.source == 'douyin'">
          <el-select v-model="all2.outer_store_id" style="width: 400px;" placeholder="请选择店铺">
            <el-option v-for="item in doudians" :label="item.shop_name" :key="item.id" :value="item.id"></el-option>
          </el-select>
        </div>

        <div class="kflexc" style="margin-top: 20px;" v-if="all2.source == 'youzan'">
          <el-select v-model="all2.outer_store_id" style="width: 400px;" placeholder="请选择店铺">
            <el-option v-for="item in doudians2" :label="item.shop_name" :key="item.id" :value="item.id"></el-option>
          </el-select>
        </div>

        <div class="kflexc" style="margin-top: 20px;">
          <el-input placeholder="请输入链接名称" style="width: 400px; " v-model="all2.name"></el-input>

          <el-tooltip class="item" effect="dark" content="起个名字，用于记忆和检索" placement="top-start">
            <i class="el-icon-warning" style="color: rgb(153, 153, 153); font-size: 22px; margin-left: 20px;"></i>
          </el-tooltip>

        </div>
        <div class="kflexc" style="margin-top: 20px;">
          <el-input placeholder="请输入抖音商品ID（SPUID）" style="width: 400px; " v-model="all2.spuid"></el-input>
        </div>
        <div class="kflexc" style="margin-top: 20px;">
          <el-select v-model="all2.mobile_type" style="width: 400px;" @change="gethaochi()" placeholder="请选择选择号池类型">
            <el-option label="线上直取" :value="1"></el-option>
            <el-option label="本地号池" :value="0"></el-option>
            <el-option label="线上号池" :value="2"></el-option>
          </el-select>
        </div>
        <div class="kflexc" style="margin-top: 20px;">
          <el-input placeholder="请输入上号所属的商品编码" @input="huoquziduan()" style="width: 400px; " v-model="all2.gth_sku"></el-input>
        </div>

        <div class="kflexc" style="margin-top: 20px;">
          <el-input placeholder="请输入号码保持数量" style="width: 400px; " type="number" v-model="all2.number_min_amount"></el-input>
        </div>


        <!-- 只有本地号池有 -->
        <div style="margin-top:20px" v-if="all2.mobile_type == 0 || all2.mobile_type == 2">
            <el-radio :label="0" v-model="all2.number_type">全部</el-radio>
            <el-radio :label="1" v-model="all2.number_type">仅上架靓号</el-radio>
            <el-radio :label="2" v-model="all2.number_type">靓号优先</el-radio>
        </div>

        <div class="kflexc" style="margin-top: 20px;" v-if="all2.mobile_type == 0 || all2.mobile_type == 2">
          <el-select v-model="all2.pool_id" style="width: 400px;" placeholder="选择关联号池">
            <el-option v-for="item in haochis" :label="item.name" :key="item.id" :value="item.id"></el-option>
          </el-select>
        </div>


        <!-- <div class="kflexc" style="margin-top: 20px;"  v-if="all2.source == 'youzan' || all2.mobile_type == 0">
          <el-input placeholder="请输入号码归属地市" style="width: 400px; " v-model="all2.number_city"></el-input>
        </div> -->

        <!-- <div v-if="all2.source == 'douyin' && all2.mobile_type == 1"> -->
        <div v-if="all2.source == 'douyin'">
          <div v-for="(item,index) in all2.belong_address_list" :key="index" class="kflexc" style=" position: relative; ">
            <i class="el-icon-delete" style="position: absolute; right: 10px; top: 30px; color: #000; z-index: 99; cursor: pointer;" @click="shanchul(index)"></i>
            <div class="kflexc" style="margin-top: 20px; margin-right: 20px;" v-for="(item2,index2) in data" :key="index2">
              <el-input :placeholder="item2.name" style="width: 200px;" v-model="item[item2.key]"></el-input>
            </div>
          </div>
          <div style="margin-top: 20px;"><el-button type="text" @click="tianjiayitiao">+添加归属地</el-button></div>
          <div style="margin-top: 20px;"><el-checkbox v-model="all2.is_display_belong_address" :false-label="0" :true-label="1">在号码上展示归属地</el-checkbox></div>
        </div>

        <div class="kflexc" style="margin-top: 20px;">
          <el-input placeholder="请输入规格名称（不填写将使用地市名称）" style="width: 400px;" v-model="all2.specs_name"></el-input>
          <el-tooltip class="item" effect="dark" content="不填写使用地市名称" placement="top-start">
            <i class="el-icon-warning" style="color: rgb(153, 153, 153); font-size: 22px; margin-left: 20px;"></i>
          </el-tooltip>
        </div>


        <div class="kflexc" style="margin-top: 20px;">
          <el-select v-model="all2.type" style="width: 400px;" placeholder="请选择更新方式">
            <el-option label="手动" :value="0"></el-option>
            <el-option label="自动" :value="1"></el-option>
            <el-option label="广电号池" :value="2"></el-option>
          </el-select>
        </div>

        <div class="kflexc" style="margin-top: 20px;" v-if="all2.type != 0">
          <el-input placeholder="设置更新间隔" style="width: 400px; " v-model="all2.auto_min">
            <template slot="append">分钟</template>
          </el-input>
        </div>

        <div class="kflexc" style="margin-top: 20px;">
          <el-input placeholder="请输入在商城端的销售价格" style="width: 400px; " v-model="all2.sale_price"></el-input>
        </div>

    	  <span slot="footer" class="dialog-footer">
          <el-button type="info" round @click="log = false">取消</el-button>
          <el-button type="danger" round @click="shangchuan">确定</el-button>
    	  </span>
    </el-dialog>

    <el-dialog title="创建号池" center :visible.sync="yinyonglog" width="440px"  :close-on-click-modal="false" :close-on-press-escape="false">
        <el-select v-model="yinyongid" style="width: 400px;" filterable clearable placeholder="商品SPUID">
          <el-option :label="item.spuid" :value="item.id" v-for="item in yinyonglist" :key="item.id"></el-option>
        </el-select>
        <span slot="footer" class="dialog-footer">
          <el-button type="info" round @click="yinyonglog = false">取消</el-button>
          <el-button type="danger" round @click="yingyonggo">确定</el-button>
        </span>
    </el-dialog>

    <el-dialog title="修改号码保持数量" center :visible.sync="log2" width="440px"  :close-on-click-modal="false" :close-on-press-escape="false">
        <div class="kflexc" style="margin-top: 20px;">
          <el-input placeholder="请输入号码保持数量" style="width: 400px; " type="number" v-model="all3.number_min_amount"></el-input>
        </div>
    	  <span slot="footer" class="dialog-footer">
          <el-button type="info" round @click="log2 = false">取消</el-button>
          <el-button type="danger" round @click="shangchuan2">确定</el-button>
    	  </span>
    </el-dialog>
    <el-dialog title="上号频率" center :visible.sync="log3" width="440px"  :close-on-click-modal="false" :close-on-press-escape="false">
        <div class="kflexc" style="margin-top: 20px;">
          <el-input placeholder="请输入分钟" style="width: 400px; " type="number" v-model="all3.auto_min"></el-input>上号/每次
        </div>
    	  <span slot="footer" class="dialog-footer">
          <el-button type="info" round @click="log3 = false">取消</el-button>
          <el-button type="danger" round @click="shangchuan2">确定</el-button>
    	  </span>
    </el-dialog>
    <el-dialog title="上号方式" center :visible.sync="log4" width="440px"  :close-on-click-modal="false" :close-on-press-escape="false">
        <el-radio v-model="all3.type" label="0">手动</el-radio>
        <el-radio v-model="all3.type" label="1">自动</el-radio>
    	  <span slot="footer" class="dialog-footer">
          <el-button type="info" round @click="log4 = false">取消</el-button>
          <el-button type="danger" round @click="shangchuan2">确定</el-button>
    	  </span>
    </el-dialog>
    <el-dialog title="号池" center :visible.sync="log5" width="440px"  :close-on-click-modal="false" :close-on-press-escape="false">
        <el-radio v-model="all3.mobile_type" label="0">本地号池</el-radio>
        <el-radio v-model="all3.mobile_type" label="1">线上号池</el-radio>
    	  <span slot="footer" class="dialog-footer">
          <el-button type="info" round @click="log5 = false">取消</el-button>
          <el-button type="danger" round @click="shangchuan2">确定</el-button>
    	  </span>
    </el-dialog>


  </div>
</template>

<script>
  import top from '../top.vue'
  import axios from 'axios'
  import moment from "moment";
  import XLSX from 'xlsx';
  import {
      read,utils
    } from 'xlsx'

  export default {
    components:{
      top
    },
    name: "wuliu",
    data() {
      return {
        sanlist: [
          {
        		name: "中国联通",
        		id: 1
        	},
        	{
        		name: "中国移动",
        		id: 2
        	},
        	{
        		name: "中国电信",
        		id: 3
        	}
        ],
        all2:{
          source:"",
          name:"",
          spuid:"",
          pool_id:"",
          number_min_amount:"",
          gth_sku:"",
          outer_store_id:"",
          number_city:"",
          id:"",
          type:"",
          auto_min:"",
          mobile_type:"",
          sale_price:"",
          belong_address_list:[],
          is_display_belong_address:0,
          specs_name:"",
          //选择靓号
          number_type:0
        },
        all3:{
          id:"",
          number_min_amount:"",
          type:"",
          auto_min:"",
          mobile_type:""
        },
        loading:false,
        list:"",
        all:{
          page:1,
          page_size:20,
          name:"",
          spuid:"",
          gth_sku:"",
          // number_pool_type:""
          // cate:3
        },
        total:0,
        shopid:'',
        log:false,
        haochis:[],
        doudians:[],
        doudians2:[],
        shangcishijian:"",
        log2:false,
        log3:false,
        log4:false,
        log5:false,
        list2:[],

        data:[],
        yinyonglog:false,
        yinyonglist:[],
        yinyongid:"",
      }
    },
    created() {
      //店铺权限问题
			this.shopid = JSON.parse(localStorage.getItem('SHOP')).shop_id;
      this.getlist()
      //获取当前年月
      // this.getNowDate()
      // console.log(this.vsdate())
      this.gethaochi()


      axios.get('/api/gth/out-store/list?source=douyin')
        .then(response => {
          if (response.data.msg.code == 0) {
            this.doudians = response.data.data
          } else {
            this.$message.error(response.data.msg.info);
          }
        })
      axios.get('/api/gth/out-store/list?source=youzan')
        .then(response => {
          if (response.data.msg.code == 0) {
            this.doudians2 = response.data.data
          } else {
            this.$message.error(response.data.msg.info);
          }
        })
    },
    mounted() {

    },
    methods: {
      gethaochi:function(){
        let number_pool_type = ""
        if(this.all2.mobile_type == 0){
          number_pool_type = 1
        }
        if(this.all2.mobile_type == 2){
          number_pool_type = 2
        }
        axios.get(`/api/plan-market/pool/list/for/web?number_pool_type=${number_pool_type}`)
        	.then(response => {
        	if (response.data.msg.code == 0) {
        		this.haochis = response.data.data
        	}
        })
      },

      yinyongkai:function(){
        this.yinyongid = ''
        axios.get('/api/tool/salePage/list?page_size=999')
          .then(response => {
            if (response.data.msg.code == 0) {
              this.yinyonglist = response.data.data.data
              this.yinyonglog = true
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      yingyonggo:function(){
        this.yinyonglist.forEach(item=>{
          if(item.id == this.yinyongid){
            this.all2 = {
              source:item.source,
              name:item.name,
              spuid:item.spuid,
              pool_id:item.pool_id,
              number_min_amount:item.number_min_amount,
              gth_sku:item.gth_sku,
              outer_store_id:item.outer_store_id,
              number_city:item.number_city,
              id:"",
              type:item.type,
              auto_min:item.auto_min,
              mobile_type:item.mobile_type,
              sale_price:item.sale_price,
              belong_address_list:item.belong_address_list,
              is_display_belong_address:item.is_display_belong_address,
              specs_name:item.specs_name,
              //选择靓号
              number_type:item.number_type
            }
          }
        })
        this.yinyonglog = false

      },
      searchs:function(){
        this.all.page = 1
        this.getlist()
      },
      shanchul:function(index){
        this.all2.belong_address_list.splice(index,1)
      },
      tianjiayitiao:function(){
        if(this.data.length > 0){
          let obj = {}
          this.data.forEach(item=>{
            obj[item.key] = ""
          })
          this.all2.belong_address_list.push(obj)
        }else{
          this.$message.error("商品编码对应商品不存在或生产提单接口未配置按归属地选号功能");
        }
      },
      huoquziduan:function(){
        axios.get('/api/plan-market/upstream/channel/select/number/config?sku='+this.all2.gth_sku)
          .then(response => {
            if (response.data.msg.code == 0) {
              if(response.data.data){
                this.data = JSON.parse(response.data.data)
                this.data.forEach(item=>{

                  if(item.name && item.name.includes('（长沙）')){
                    item.name = item.name.replace("（长沙）", "");
                  }
                  if(item.name && item.name.includes('（长沙市）')){
                    item.name = item.name.replace("（长沙市）", "");
                  }

                })
              }else{
                this.data = []
              }
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      changedoudians:function(){
        this.all2.outer_store_id = ""
      },
      gengxinhaoma:function(item){
        axios.post('/api/plan-market/dy/product/set',{id:item.id})
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message.success(`操作成功`);
              this.getlist()
              this.getshangcishujian()
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      log2show:function(item){
        this.all3.id = item.id
        this.all3.number_min_amount = item.number_min_amount
        this.all3.auto_min = item.auto_min
        this.all3.type = item.type.toString()
        this.all3.mobile_type = item.mobile_type.toString()

        this.log2 = true
      },
      log3show:function(item){
        this.all3.id = item.id
        this.all3.number_min_amount = item.number_min_amount
        this.all3.auto_min = item.auto_min
        this.all3.type = item.type.toString()
        this.all3.mobile_type = item.mobile_type.toString()
        this.log3 = true
      },
      log4show:function(item){
        this.all3.id = item.id
        this.all3.number_min_amount = item.number_min_amount
        this.all3.auto_min = item.auto_min
        this.all3.type = item.type.toString()
        this.all3.mobile_type = item.mobile_type.toString()
        this.log4 = true
      },
      log5show:function(item){
        this.all3.id = item.id
        this.all3.number_min_amount = item.number_min_amount
        this.all3.auto_min = item.auto_min
        this.all3.type = item.type.toString()
        this.all3.mobile_type = item.mobile_type.toString()
        this.log5 = true
      },
      shangchuan2:function(){
        axios.post('/api/tool/salePage/make',this.all3)
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message.success(`操作成功`);
              this.getlist()
              this.log2 =false
              this.log3 =false
              this.log4 =false
              this.log5 =false
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      shuaxin:function(){
        axios.get(`/api/tool/dy/product/info`)
        	.then(response => {
        	if (response.data.msg.code == 0) {
            this.$message.success(`操作成功`);
            this.list2 = response.data.data
            this.list.forEach(item=>{
              this.list2.forEach(item2=>{
                if(item.id == item2.id){
                  this.$set(item,'not_sale_num',item2.not_sale_num)
                  // item.not_sale_num = item2.not_sale_num
                }
              })
            })
        	}
        })
      },
      getshangcishujian:function(){
        // axios.get('/api/tool/salePage/make')
        //   .then(response => {
        //     if (response.data.msg.code == 0) {
        //       this.shangcishijian = response.data.data
        //     } else {
        //       this.$message.error(response.data.msg.info);
        //     }
        //   })
      },
      shangchuan:function(){
        axios.post('/api/tool/salePage/make',this.all2)
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message.success(`操作成功`);
              this.getlist()
              this.log =false
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      logkai2:function(item){
        this.$router.push('/gongju/shanghao/haoma?id='+item.id)
      },
      fuzhi:function(item){
        this.all2 = {
          id:'',
          name:item.name,
          spuid:item.spuid,
          pool_id:item.pool_id,
          number_min_amount:item.number_min_amount,
          gth_sku:item.gth_sku,
          outer_store_id:item.outer_store_id,
          number_city:item.number_city,
          type:item.type,
          auto_min:item.auto_min,
          mobile_type:item.mobile_type,
          sale_price:item.sale_price,
          source:item.source,
          belong_address_list:item.belong_address_list,
          is_display_belong_address:item.is_display_belong_address,
          specs_name:item.specs_name,
          number_type:item.number_type
        }
        this.log = true
      },
      logkai:function(item){
        if(item){
          this.all2 = {
            id:item.id,
            name:item.name,
            spuid:item.spuid,
            pool_id:item.pool_id,
            number_min_amount:item.number_min_amount,
            gth_sku:item.gth_sku,
            outer_store_id:item.outer_store_id,
            number_city:item.number_city,
            type:item.type,
            auto_min:item.auto_min,
            mobile_type:item.mobile_type,
            sale_price:item.sale_price,
            source:item.source,
            belong_address_list:item.belong_address_list,
            is_display_belong_address:item.is_display_belong_address,
            specs_name:item.specs_name,
            number_type:item.number_type
          }
          this.huoquziduan()

        }else{
          this.all2 = {
            id:"",
            name:"",
            spuid:"",
            pool_id:"",
            number_min_amount:"",
            gth_sku:"",
            outer_store_id:"",
            number_city:"",
            type:"",
            auto_min:"",
            mobile_type:"",
            sale_price:"",
            source:"",
            belong_address_list:[],
            is_display_belong_address:0,
            specs_name:"",
            number_type:"",
          }

        }
        console.log(this.all2)
        this.log = true
      },
      readExcel1(files) {
        return new Promise((res, rej) => {
          var that = this;
          if (files.length <= 0) {
            return;
          }
          if (!/\.(xls|xlsx)$/.test(files[0].name.toLowerCase())) {
            this.$Message.error('上传格式不正确，请上传xls或者xlsx格式');
            return;
          }
          const fileReader = new FileReader();
          fileReader.onload = (ev) => {
            try {
              const data = ev.target.result;
              const workbook = read(data, {
                type: 'binary'
              });
              // 取第一张表
              const wsname = workbook.SheetNames[0];
              // 生成json表格内容
              const ws = utils.sheet_to_json(workbook.Sheets[wsname]);
              console.log(ws);
              // 后续为自己对ws数据的处理
              res(ws)
            } catch (e) {
              return false;
              rej(e)
            }
          };
          fileReader.readAsBinaryString(files[0]);
        })

      },

      uploasd2(file, fileList) {
        var that = this
        let files = {
          0: file
        }
        let data = {
          pool_id:"",
          numbers:[]
        }

        let ff = this.readExcel1(files);
        ff.then((res) => {

          res.forEach(item => {
            let obj = {
              mobile: item['手机号码'],
              province: item['省'],
              city: item['市'],
            }
            data.numbers.push(obj)
          })

          axios.post('/api/plan-market/numbers/import',data)
            .then(response => {
              if (response.data.msg.code == 0) {
                this.$message.success(`导入成功`);
                this.getlist()
              } else {
                this.$message.error(response.data.msg.info);
              }
            })
        })
      },

      //统计

      search: function() {
        this.all.page = 1
        this.getlist()
      },
      //翻页
      fanye: function(page) {
        this.loading = true
        this.all.page = page
        this.getlist()
      },
      //获取列表
      getlist: function() {
        axios.get('/api/tool/salePage/list',{params:this.all})
          .then(response => {
            if (response.data.msg.code == 0) {
              this.list = response.data.data.data
              this.total = response.data.data.total
              this.loading = false

            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },

      //下载模板
      xiazai: function() {
        const a = document.createElement('a');
        a.setAttribute('download', '订单重复查询.xlsx');
        a.setAttribute('href',location.origin + location.pathname + 'static/dingdanchongfu.xlsx');
        a.click();
      },

      //真下载
      xiazai2: function(dizhi) {
        var a = document.createElement('a');

        a.setAttribute('href',location.origin + '/' + dizhi);
        a.click();
      },

      del(row){
        this.$confirm('是否确认删除?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          axios.post('/api/tool/salePage/del',{
            id:row.id
          })
            .then(response => {
              if (response.data.msg.code == 0) {
                this.$message.success(`操作成功`);
                this.getlist()
              } else {
                this.$message.error(response.data.msg.info);
              }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消'
          });
        });
      }
    }
  }
</script>

<style lang="scss" scoped>
  .wuliu {
    /deep/ .el-input-group__append{ border: 0;}
    .powertop {
    	display: flex;
    	background:#f9f9f9;
    }
    .powertopli {
    	flex-basis: 180px;
    	line-height: 50px;
    	border-bottom: 3px #F9F9F9 solid;
    	color: #727272;
    	border-right: 1px #F9F9F9 solid;
    	font-size: 16px;
    	text-align: center;
    }
    .router-link-active {
    	background: #FFFFFF;
    	border-bottom: 3px #2974FF solid;
    }
    /deep/ .el-pagination.is-background .btn-prev:disabled{ background: rgba(246, 246, 246, 0.3); border: 1px rgba(167, 167, 167, 0.3) solid;}
    /deep/ .el-pagination.is-background .btn-next:disabled{ background: rgba(246, 246, 246, 0.3); border: 1px rgba(167, 167, 167, 0.3) solid;}
    /deep/ .el-pagination.is-background .btn-next{ background: rgba(246, 246, 246,1); border: 1px rgba(167, 167, 167,1) solid;}
    /deep/ .el-pagination.is-background .btn-prev{ background: rgba(246, 246, 246,1); border: 1px rgba(167, 167, 167,1) solid;}
    /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{ background-color: #2974FF;}
    /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active:hover {
        color: #fff;
    }
    /deep/ .el-pagination.is-background .el-pager li:not(.disabled):hover {
        color: #2974FF;
    }
    /deep/ .el-pager li{ border-radius: 14px; background: rgba(255, 255, 255, 1); border: 1px rgba(167, 167, 167, 0.3) solid;}
    /deep/ .btn-prev{ border-radius: 14px; padding: 0 10px;}
    /deep/ .btn-next{ border-radius: 14px; padding: 0 10px;}

    /deep/ .el-table th{ background: rgb(246, 246, 246);}
    /deep/ .el-input__inner{ line-height: 36px; height: 36px; font-size: 12px; background: rgb(247, 248, 250);  border: 0;}
    /deep/ .el-date-editor .el-range-input{ background: rgb(247, 248, 250); }
    /deep/ .el-button{ padding: 11px 23px !important;}
    /deep/ .el-button--mini{ padding: 6px 15px !important;}
    /deep/ .el-button--danger {
        color: #FFF;
        background-color: #2974FF;
        border-color: #2974FF;
    }
    .team {
    	background: #F9F9F9;
    }
  }
</style>
